// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.

import React from 'react';

type SvgProps = {
    width: number;
    height: number;
}

const EmptyStateThemeableSvg = (props: SvgProps) => (
    <svg
        width={props.width ? props.width.toString() : '406'}
        height={props.height ? props.height.toString() : '312'}
        viewBox='0 0 406 312'
        fill='none'
        xmlns='http://www.w3.org/2000/svg'
        xmlnsXlink='http://www.w3.org/1999/xlink'
    >
        <g clipPath='url(#clip0)'>
            <path
                d='M224.13 279.63C291.724 279.63 346.52 224.834 346.52 157.24C346.52 89.6455 291.724 34.8496 224.13 34.8496C156.536 34.8496 101.74 89.6455 101.74 157.24C101.74 224.834 156.536 279.63 224.13 279.63Z'
                fill='var(--center-channel-color)'
                fillOpacity='0.04'
            />
            <path
                d='M248.69 85.2799C253.27 84.2799 261.45 83.4898 267.32 87.1198C271.14 89.4898 273.32 93.6898 276.03 97.2598C279.09 101.31 282.96 104.69 286.2 108.61C291.093 114.667 294.407 121.844 295.843 129.497C297.28 137.15 296.794 145.041 294.43 152.46C292.88 157.13 290.59 161.56 289.36 166.33C287.8 172.33 288 178.7 287.53 184.92C286.22 202.19 279.74 218.59 273.33 234.69C271.41 239.52 269.41 244.47 265.85 248.26C262.896 251.288 259.107 253.368 254.967 254.235C250.826 255.102 246.521 254.717 242.6 253.13C236.97 250.73 232.49 245.88 226.6 244.28C223.78 243.51 220.82 243.54 217.92 243.28C210.492 242.615 203.362 240.039 197.223 235.804C191.085 231.568 186.147 225.817 182.888 219.108C179.63 212.399 178.163 204.962 178.63 197.519C179.096 190.075 181.48 182.879 185.55 176.63C188.361 172.564 191.52 168.75 194.99 165.23L212.06 146.85C216.38 142.19 220.85 137.29 222.59 131.18C223.87 126.69 223.59 121.92 223.94 117.27C224.67 108.51 228.07 99.7999 234.36 93.6599C240.65 87.5199 244.62 86.1499 248.69 85.2799Z'
                fill='#66320A'
            />
            <mask
                id='mask0'
                mask-type='alpha'
                maskUnits='userSpaceOnUse'
                x='178'
                y='84'
                width='119'
                height='171'
            >
                <path
                    d='M248.69 85.2799C253.27 84.2799 261.45 83.4898 267.32 87.1198C271.14 89.4898 273.32 93.6898 276.03 97.2598C279.09 101.31 282.96 104.69 286.2 108.61C291.093 114.667 294.407 121.844 295.843 129.497C297.28 137.15 296.794 145.041 294.43 152.46C292.88 157.13 290.59 161.56 289.36 166.33C287.8 172.33 288 178.7 287.53 184.92C286.22 202.19 279.74 218.59 273.33 234.69C271.41 239.52 269.41 244.47 265.85 248.26C262.896 251.288 259.107 253.368 254.967 254.235C250.826 255.102 246.521 254.717 242.6 253.13C236.97 250.73 232.49 245.88 226.6 244.28C223.78 243.51 220.82 243.54 217.92 243.28C210.492 242.615 203.362 240.039 197.223 235.804C191.085 231.568 186.147 225.817 182.888 219.108C179.63 212.399 178.163 204.962 178.63 197.519C179.096 190.075 181.48 182.879 185.55 176.63C188.361 172.564 191.52 168.75 194.99 165.23L212.06 146.85C216.38 142.19 220.85 137.29 222.59 131.18C223.87 126.69 223.59 121.92 223.94 117.27C224.67 108.51 228.07 99.7999 234.36 93.6599C240.65 87.5199 244.62 86.1499 248.69 85.2799Z'
                    fill='#66320A'
                />
            </mask>
            <g mask='url(#mask0)'>
                <rect
                    x='178'
                    y='84'
                    width='97'
                    height='171'
                    fill='url(#pattern0)'
                />
            </g>
            <mask
                id='mask1'
                mask-type='alpha'
                maskUnits='userSpaceOnUse'
                x='101'
                y='34'
                width='246'
                height='246'
            >
                <path
                    d='M224.13 279.63C291.724 279.63 346.52 224.834 346.52 157.24C346.52 89.6455 291.724 34.8496 224.13 34.8496C156.536 34.8496 101.74 89.6455 101.74 157.24C101.74 224.834 156.536 279.63 224.13 279.63Z'
                    fill='#F4F4F6'
                />
            </mask>
            <g mask='url(#mask1)'>
                <path
                    d='M250.36 173.06L233.82 208.56C233.4 209.56 233.82 211.69 234.73 212.13C250.06 219.13 256.57 226.62 259.13 229.39C270.623 241.824 281.777 254.554 292.59 267.58C300.97 263.42 319.08 249.37 328.94 235.92C367.64 183.15 348.19 137.8 343.29 139.53C321.29 147.27 311.83 152.59 293.08 166.43C287.951 169.92 282.463 172.85 276.71 175.17C268.71 178.32 257.6 173.68 253.26 171.58C252.28 171.15 250.74 172.04 250.36 173.06Z'
                    fill='var(--center-channel-bg)'
                />
                <mask
                    id='mask2'
                    mask-type='alpha'
                    maskUnits='userSpaceOnUse'
                    x='233'
                    y='139'
                    width='120'
                    height='129'
                >
                    <path
                        d='M250.36 173.06L233.82 208.56C233.4 209.56 233.82 211.69 234.73 212.13C250.06 219.13 256.57 226.62 259.13 229.39C270.623 241.824 281.777 254.554 292.59 267.58C300.97 263.42 319.08 249.37 328.94 235.92C367.64 183.15 348.19 137.8 343.29 139.53C321.29 147.27 311.83 152.59 293.08 166.43C287.951 169.92 282.463 172.85 276.71 175.17C268.71 178.32 257.6 173.68 253.26 171.58C252.28 171.15 250.74 172.04 250.36 173.06Z'
                        fill='var(--center-channel-bg)'
                    />
                </mask>
                <g mask='url(#mask2)'>
                    <rect
                        x='233'
                        y='139'
                        width='120'
                        height='129'
                        fill='url(#pattern1)'
                    />
                </g>
            </g>
            <path
                d='M121.47 43.4204C121.7 47.0904 121.38 59.9904 121.47 61.2104C122.47 77.2704 158.14 122.29 161.61 125.68C169.96 133.87 187.85 144.42 197.92 150.34C218.92 162.66 227.69 163.75 250.38 173.06L233.84 208.56C199.49 196.21 184.48 187.1 166.54 175C160.21 170.73 147.47 161.76 142.33 156.62C121.26 135.55 112.06 96.1003 103.33 77.2703C99.0699 68.0803 96.67 67.6104 93.91 63.8204C90.33 58.8804 90.1001 57.3204 87.1901 53.0604C82.4301 46.0604 73.1301 40.6304 70.1901 34.5804C70.1345 34.4406 70.121 34.2875 70.1514 34.1402C70.1818 33.9929 70.2547 33.8578 70.3611 33.7514C70.4674 33.6451 70.6026 33.5721 70.7499 33.5417C70.8972 33.5113 71.0503 33.5248 71.1901 33.5804C76.7801 36.3104 80.92 39.1803 86.98 42.0903C87.98 39.4603 84.73 34.4704 81.6 29.5404C78.66 24.9204 72.85 9.14034 75.09 6.90034C76.2 5.79034 79.56 10.5903 81.15 13.4003C86.98 23.7103 89.89 26.6303 89.89 26.6303C89.89 26.6303 77.89 5.50032 78.68 3.76032C80.47 -0.239676 88.5099 11.3303 94.8199 20.7603C98.4099 26.1403 100.65 27.4803 100.65 27.4803C100.65 27.4803 98.65 11.1203 97.29 3.48029C96.29 -2.10971 99.65 -0.749705 101.99 5.48029C103.34 9.07029 103.99 11.8504 105.99 18.0404C107.009 21.1082 108.208 24.1134 109.58 27.0404C111 30.1217 112.725 33.0531 114.73 35.7904C115.21 31.3904 115.4 29.7303 117.42 25.4803C119.56 20.9703 124.59 15.1603 122.35 24.1303C120.73 30.6803 121.25 40.0004 121.47 43.4204Z'
                fill='#FFBC1F'
            />
            <path
                d='M272.45 156.15C270.52 155.15 268.14 153.99 266.18 153.01C262.1 151.01 258.58 149.12 255.59 145.68C249.175 138.302 243.697 130.161 239.28 121.44C237.214 117.702 235.784 113.647 235.05 109.44C234.47 105.22 235.18 100.68 237.75 97.2796C242.25 91.3296 252.68 89.5996 257.66 91.1396C263.2 92.8596 270.47 100.14 275.14 106.38C281.239 114.334 286.497 122.9 290.83 131.94C291.27 132.81 293.1 141.02 293.32 141.42C298.9 151.66 306.08 155.25 306.08 155.25L310.67 153.47C312.759 152.651 315.039 152.452 317.238 152.896C319.437 153.339 321.461 154.406 323.07 155.97C324.05 156.875 324.895 157.915 325.58 159.06C330.96 169.37 331 181.01 323.79 188.2C316.58 195.39 309.39 198.2 299.35 196.5C293.746 195.396 288.374 193.336 283.47 190.41C276.47 186.41 276.01 177.14 282.15 171.94C282.13 171.91 277.61 158.9 272.45 156.15Z'
                fill='#FFBC1F'
            />
            <path
                opacity='0.5'
                d='M277.65 162.15C287.78 157.46 290.42 151.49 291.04 149.68C291.089 149.528 291.094 149.365 291.053 149.211C291.012 149.057 290.928 148.918 290.81 148.81L290.69 148.72C290.52 148.609 290.315 148.567 290.115 148.6C289.915 148.633 289.735 148.74 289.61 148.9C288.348 150.408 286.857 151.707 285.19 152.75C282.291 154.836 278.821 155.981 275.25 156.03C273.934 156.03 272.622 155.879 271.34 155.58C271.73 155.78 272.12 155.98 272.48 156.18C274.33 157.15 276.13 159.5 277.65 162.15Z'
                fill='#CC8F00'
            />
            <path
                d='M268.63 137.64C271.752 136.617 274.352 134.418 275.88 131.51C276.28 130.75 275.12 130.07 274.72 130.84C273.37 133.445 271.055 135.419 268.27 136.34C267.46 136.61 267.81 137.91 268.63 137.64Z'
                fill='#66320A'
            />
            <path
                d='M251.67 100.91C249.31 110.09 248.9 119.62 239.93 125C233.6 120.32 230.71 105.38 235.02 97.6099C237.52 93.0999 245.68 87.87 252.02 85.88C254.08 85.23 262.94 90.09 262.85 90.88C262.19 96.88 255.63 102.66 252.54 107.88L251.67 100.91Z'
                fill='#66320A'
            />
            <path
                d='M283.24 120.21C282.85 118.14 284.82 116.32 284.99 114.21C285.21 111.49 282.52 109.54 280.15 108.21C279.861 107.998 279.508 107.892 279.15 107.91C278.55 108.01 278.29 108.7 278.15 109.29C277.685 112.018 278.275 114.821 279.8 117.13L283.24 120.21Z'
                fill='#FFBC1F'
            />
            <path
                d='M281.6 113.49C281.468 113.218 281.437 112.908 281.512 112.615C281.588 112.322 281.764 112.066 282.01 111.89C282.73 111.41 282.01 110.25 281.33 110.73C280.785 111.095 280.394 111.647 280.23 112.281C280.066 112.915 280.141 113.588 280.44 114.17C280.83 114.94 281.99 114.26 281.6 113.49Z'
                fill='#66320A'
            />
            <path
                d='M113.61 34.8394C110.27 38.2494 108.61 43.2795 107.96 47.9295C107.49 51.5095 108.96 56.4195 112.17 58.3995C112.324 58.4897 112.507 58.5151 112.68 58.4701C112.852 58.425 113 58.3133 113.09 58.1595C113.18 58.0057 113.205 57.8223 113.16 57.6497C113.115 57.4772 113.004 57.3296 112.85 57.2395C109.56 55.2395 108.85 50.3395 109.48 46.8995C110.22 42.8995 111.68 38.7295 114.56 35.7895C115.16 35.1695 114.21 34.2195 113.56 34.7895L113.61 34.8394Z'
                fill='#66320A'
            />
            <path
                d='M97.49 70.1498C100.57 72.3298 105.66 72.7098 108.54 69.8898C109.16 69.2898 108.21 68.3398 107.54 68.8898C105.06 71.3198 100.71 70.7698 98.12 68.8898C97.41 68.3898 96.7401 69.5598 97.4401 70.0498L97.49 70.1498Z'
                fill='#66320A'
            />
            <path
                d='M261.02 122.54C261.927 124.071 262.601 125.73 263.02 127.46C263.25 128.39 263.25 129.37 263.46 130.3C263.473 130.619 263.562 130.932 263.72 131.21C264.88 132.69 267.14 130.81 267.88 129.8C268.39 129.11 267.23 128.43 266.72 129.13C266.41 129.54 265.61 130.5 265.06 130.27C264.68 130.11 264.78 129.91 264.72 129.39C264.625 128.516 264.464 127.65 264.24 126.8C263.774 125.065 263.071 123.402 262.15 121.86C262.06 121.706 261.912 121.594 261.74 121.549C261.567 121.504 261.384 121.529 261.23 121.62C261.076 121.71 260.964 121.857 260.919 122.03C260.874 122.202 260.9 122.386 260.99 122.54H261.02Z'
                fill='#66320A'
            />
            <path
                d='M265.28 111.62C264.864 111.62 264.464 111.786 264.17 112.08C263.875 112.374 263.71 112.774 263.71 113.19C263.71 113.607 263.875 114.006 264.17 114.3C264.464 114.595 264.864 114.76 265.28 114.76C265.696 114.76 266.096 114.595 266.39 114.3C266.685 114.006 266.85 113.607 266.85 113.19C266.85 112.774 266.685 112.374 266.39 112.08C266.096 111.786 265.696 111.62 265.28 111.62Z'
                fill='#66320A'
            />
            <path
                d='M252.39 120.479C251.997 120.511 251.629 120.69 251.362 120.98C251.094 121.27 250.945 121.65 250.945 122.045C250.945 122.439 251.094 122.819 251.362 123.109C251.629 123.4 251.997 123.578 252.39 123.609C252.783 123.578 253.151 123.4 253.418 123.109C253.686 122.819 253.835 122.439 253.835 122.045C253.835 121.65 253.686 121.27 253.418 120.98C253.151 120.69 252.783 120.511 252.39 120.479Z'
                fill='#66320A'
            />
            <path
                d='M233.82 208.56L247.56 179.08'
                stroke='#5E4200'
                strokeWidth='1.34'
                strokeMiterlimit='10'
                strokeLinecap='round'
            />
        </g>
        <defs>
            <pattern
                id='pattern0'
                patternContentUnits='objectBoundingBox'
                width='1'
                height='1'
            >
                <use
                    xlinkHref='#image0'
                    transform='scale(0.0103093 0.00584795)'
                />
            </pattern>
            <pattern
                id='pattern1'
                patternContentUnits='objectBoundingBox'
                width='1'
                height='1'
            >
                <use
                    xlinkHref='#image1'
                    transform='scale(0.00833333 0.00775194)'
                />
            </pattern>
            <clipPath id='clip0'>
                <rect
                    width='346'
                    height='312'
                    fill='var(--center-channel-bg)'
                    transform='translate(48)'
                />
            </clipPath>
            <image
                id='image0'
                width='97'
                height='171'
                xlinkHref=''
            />
            <image
                id='image1'
                width='120'
                height='129'
                xlinkHref=''
            />
        </defs>
    </svg>

);

export default EmptyStateThemeableSvg;
